<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
	<head th:replace="_fragments :: head(~{::title})">
		<title>分类页面</title>
	</head>
	<body>
	<nav th:replace="_fragments :: menu(5)" >

	</nav>
		<div class=" m-padded-tb-big m-container">
				<div class="ui container">
					<div class="ui stackable grid">
						<div class="eleven wide column">
							<div class="ui segment"><img src="https://picsum.photos/id/996/800/450" alt="" class="ui rounded image" /></div>
							
						</div>
						<div class="five wide column">
							<div class="ui top attached segment">
								<div class="ui header">关于我</div>
							</div>
							<div class="ui attached segment">
								<p class="m-text">我见过你们人类绝对无法置信的事物，我目睹了战船在猎户星座的端沿起火燃烧，我看着C射线在唐怀瑟之门附近的黑暗中闪耀，所有这些时刻，终将随时间消逝，一如眼泪消失在雨中。</p>
							</div>
							<div class="ui attached segment">
								<div class="ui basic orange left pointing label">编程</div>
								<div class="ui basic orange left pointing label">看书</div>
								<div class="ui basic orange left pointing label">运动</div>
								<div class="ui basic orange left pointing label">摇滚</div>
							</div>
							<div class="ui attached segment">
								<div class="ui basic teal left pointing label m-margin-tb-tiny">Java</div>
								<div class="ui basic teal left pointing label m-margin-tb-tiny">C#</div>
								<div class="ui basic teal left pointing label m-margin-tb-tiny">Python</div>
								<div class="ui basic teal left pointing label m-margin-tb-tiny">C++</div>
							</div>
							<div class="ui bottom attached segment">
								<a href="https://github.com/" target="_blank" class="ui circular icon button"><i class="github icon"></i></a>
								<a href="#" class="ui wechat  circular icon button"><i class="weixin icon"></i></a>
								<a href="#" class="ui qq circular icon button" data-content="1316196993" data-position="bottom center"><i class="qq icon"></i></a>
							</div>
								<div class="ui wechatQR flowing popup  transition hidden">
									<img src="../static/images/cat.jpg" th:src="@{/images/cat.jpg}" alt="" class="ui rounded image"style="width: 100px;" />
								</div>
						</div>
					</div>
				</div>
				</div>
		<br />
		<br />
	<footer th:replace="_fragments :: footer" class="ui inverted vertical segment m-padded-tb-massive">

	</footer>
		<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>

		<script>
			$('.menu.toggle').click(function(){
				$('.m-item').toggleClass('m-mobile-hide');
			});
			$('.qq').popup();
			$('.wechat').popup({
				popup : $('.wechatQR,popup'),
				on : 'hover',
				position: 'bottom center'
			});
			$('#newBlog-container').load(/*[[@{/footer/newblog}]]*/"/footer/newblog")
		</script>
	</body>
</html>
